<template>
  <!-- 创建独立产品 -->

  <div class="wh100 addbox flexbox flexbox_column">
    <div class="flexbox">
      <div class="flexCenter">
        <el-button type="success" size="default" style="width: 100px;height: 36px;" @click="returnHandler"
          >返回
        </el-button>
      </div>

      <div class="wh100 flexbox flex_center">
        <h2 style="font-size:20px;">
          {{ infoModel.isAdd == 'add' ? '新增入库单' : `${infoModel.warehouse_code} --- 修改` }}
        </h2>
      </div>
    </div>

    <div class="infoBox flexbox_column mtop10">
      <el-form :model="infoModel" :rules="rules" ref="ruleForm" label-width="150px" class="demo-ruleForm">
        <el-card class="flexbox_column" style="">
          <el-row>
            <el-col :span="12" class="flexbox">
              <el-row>
                <h3 class="flexbox">入库信息</h3>
                <el-col :span="24" class="flexbox">
                  <el-form-item label="仓库：" prop="warehouse_code">
                    <el-select v-model="infoModel.warehouse_code" clearable class="w350px" placeholder="请选择">
                      <el-option v-for="ele in warehouseList" :key="ele.code" :label="ele.name" :value="ele.code">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="入库类型：" prop="inbound_order_type">
                    <el-radio-group v-model="infoModel.inbound_order_type">
                      <el-radio :label="1">仅入库</el-radio>
                      <el-radio :label="2">入库与转运</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="货柜类型：" prop="container_type">
                    <el-select v-model="infoModel.container_type" clearable class="w350px" placeholder="请选择">
                      <!-- 1.箱子 2.托盘栈板 3.代表20 4.代表20GP 5.代表40GP 6.代表40HQ 7.代表45GP 8.代表45HQ -->

                      <el-option label="箱子" :value="1"></el-option>
                      <el-option label="托盘栈板" :value="2"></el-option>
                      <el-option label="代表20" :value="3"></el-option>
                      <el-option label="代表20GP" :value="4"></el-option>
                      <el-option label="代表40GP" :value="5"></el-option>
                      <el-option label="代表40HQ" :value="6"></el-option>
                      <el-option label="代表45GP" :value="7"></el-option>
                      <el-option label="代表45HQ" :value="8"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="24" class="flexbox">
                  <el-form-item label="入库栈板：" prop="inbound_pallet">
                    <el-input-number
                      v-model="infoModel.inbound_pallet"
                      :min="0"
                      :max="99999999999"
                      :controls="false"
                      class="w350px"
                      label="请输入"
                    ></el-input-number>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="预计送达时间：" prop="estimate_delivery_time">
                    <el-date-picker
                      v-model="infoModel.estimate_delivery_time"
                      type="date"
                      class="w350px"
                      placeholder="选择日期"
                    >
                    </el-date-picker>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="运输方式：" prop="shipping_method">
                    <el-input
                      type="textarea"
                      placeholder="请输入"
                      maxlength="500"
                      show-word-limit
                      class="w350px"
                      v-model.trim="infoModel.shipping_method"
                    ></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="采购订单号：" prop="purchase_order_no">
                    <el-input
                      type="textarea"
                      placeholder="请输入"
                      maxlength="500"
                      show-word-limit
                      class="w350px"
                      v-model.trim="infoModel.purchase_order_no"
                    ></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="柜号/物流单号：" prop="tracking_number">
                    <el-input
                      type="textarea"
                      placeholder="请输入"
                      maxlength="500"
                      show-word-limit
                      class="w350px"
                      v-model.trim="infoModel.tracking_number"
                    ></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-col>

            <el-col :span="12" class="flexbox">
              <el-row>
                <h3 class="flexbox">发件人地址：</h3>
                <el-col :span="24" class="flexbox">
                  <el-form-item label="寄件人名称：" prop="sender_name">
                    <el-input
                      v-model.trim="infoModel.sender_address.sender_name"
                      placeholder="请输入"
                      maxlength="100"
                      show-word-limit
                      class="w350px"
                      clearable
                    ></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="寄件公司：" prop="sender_company">
                    <el-input
                      v-model.trim="infoModel.sender_address.sender_company"
                      placeholder="请输入"
                      maxlength="100"
                      show-word-limit
                      class="w350px"
                      clearable
                    ></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="寄件人联系电话：" prop="sender_phone">
                    <el-input
                      v-model.trim="infoModel.sender_address.sender_phone"
                      placeholder="请输入"
                      maxlength="100"
                      show-word-limit
                      class="w350px"
                      clearable
                    ></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="寄件人邮箱：" prop="sender_email">
                    <el-input
                      v-model.trim="infoModel.sender_address.sender_email"
                      placeholder="请输入"
                      maxlength="100"
                      show-word-limit
                      class="w350px"
                      clearable
                    ></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="寄件人地址1：" prop="sender_address_line1">
                    <el-input
                      v-model.trim="infoModel.sender_address.sender_address_line1"
                      placeholder="请输入"
                      maxlength="100"
                      show-word-limit
                      class="w350px"
                      clearable
                    ></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="寄件人地址2：" prop="sender_address_line2">
                    <el-input
                      v-model.trim="infoModel.sender_address.sender_address_line2"
                      placeholder="请输入"
                      maxlength="100"
                      show-word-limit
                      class="w350px"
                      clearable
                    ></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="寄件人国家编码：" prop="sender_country_code">
                    <el-input
                      v-model.trim="infoModel.sender_address.sender_country_code"
                      placeholder="请输入"
                      maxlength="100"
                      show-word-limit
                      class="w350px"
                      clearable
                    ></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="寄件人所在城市：" prop="sender_state_code">
                    <!-- <el-cascader :options="categoryList"
                                 class="w350px"
                                 filterable
                                 v-model="infoModel.sender_state_code"
                                 clearable></el-cascader> -->
                    <el-input
                      v-model="infoModel.sender_address.sender_state_code"
                      placeholder="请输入"
                      maxlength="100"
                      show-word-limit
                      class="w350px"
                      clearable
                    ></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="寄件人邮政编码：" prop="sender_zip_code">
                    <el-input
                      v-model.trim="infoModel.sender_address.sender_zip_code"
                      placeholder="请输入"
                      maxlength="100"
                      show-word-limit
                      class="w350px"
                      clearable
                    ></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="24" class="flexbox">
                  <el-form-item label="入库栈板：" prop="send_inbound_pallet">
                    <el-input
                      v-model.trim="infoModel.sender_address.send_inbound_pallet"
                      placeholder="请输入"
                      maxlength="100"
                      show-word-limit
                      class="w350px"
                      clearable
                    ></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-col>
          </el-row>

          <el-row style="margin-top:60px;">
            <div class="flexbox flex_row_space-between">
              <h3>入库组成</h3>
              <h3>箱子总数：{{ (infoModel.total_packages = infoModel.inbound_packages_list.length || 0) }}</h3>
              <div>
                <el-button type="success" @click="addCase">添加箱子</el-button>
              </div>
            </div>

            <el-col :span="24" class="flexbox">
              <el-table
                :data="infoModel.inbound_packages_list"
                highlight-current-row
                class="wh100"
                :row-class-name="tableRowClassName"
              >
                <el-table-column header-align="center" width="130" align="center" label="箱号">
                  <template #header="scope">
                    <span><span style="color:red;"> * </span>{{ scope.column.label }}</span>
                  </template>
                  <template slot-scope="scope">
                    <div class="boxposition">
                      <el-form-item
                        :prop="`inbound_packages_list.${scope.$index}.box_model`"
                        :rules="checkRuleInfo.box_model"
                        label-width="0"
                        class="per_quantityClass"
                      >
                        <el-select
                          v-model="scope.row.box_model"
                          clearable
                          style="min-width:70px; max-width:100px;"
                          placeholder="请选择箱号"
                        >
                          <el-option label="大号" :value="1"></el-option>
                          <el-option label="中号" :value="2"></el-option>
                          <el-option label="小号" :value="3"></el-option>
                          <el-option label="特大号" :value="4"></el-option>
                        </el-select>
                      </el-form-item>
                    </div>
                  </template>
                </el-table-column>

                <el-table-column prop="quantity" header-align="center" align="center" width="150" label="箱子数量">
                  <template #header="scope">
                    <span><span style="color:red;"> * </span>{{ scope.column.label }}</span>
                  </template>
                  <template slot-scope="scope">
                    <div class="boxposition">
                      <el-form-item
                        :prop="`inbound_packages_list.${scope.$index}.quantity`"
                        :rules="checkRuleInfo.quantity"
                        label-width="0"
                        class="per_quantityClass"
                      >
                        <el-input-number
                          v-model="scope.row.quantity"
                          :min="0"
                          :max="999999"
                          :controls="false"
                          @blur="blurQuantity(1)"
                          class="inlineBlock"
                          placeholder="输入数量"
                          style="width:120px;"
                        >
                        </el-input-number>
                      </el-form-item>
                    </div>
                  </template>
                </el-table-column>

                <el-table-column
                  prop="length"
                  :header-align="idx == 3 ? 'left' : 'center'"
                  :width="idx == 3 ? 170 : 200"
                  align="center"
                  v-for="(iten, idx) in columnsList"
                  :label="iten.title"
                  :key="idx"
                >
                  <template #header="scope">
                    <span><span style="color:red;"> * </span>{{ scope.column.label }}</span>
                  </template>
                  <template slot-scope="scope">
                    <div
                      class="flexbox_column"
                      style="height:40px;"
                      v-for="(item, i) in infoModel.inbound_packages_list[scope.$index] &&
                        infoModel.inbound_packages_list[scope.$index].inbound_packages_items_list"
                      :key="i"
                      :class="i > 0 ? 'mtop10' : ''"
                    >
                      <template v-if="idx <= 1">
                        <el-form-item
                          :prop="`inbound_packages_list.${scope.$index}.inbound_packages_items_list.${i}.product_id`"
                          label-width="0"
                          class="mb0"
                          :rules="checkRuleInfo.product_id"
                        >
                          <el-select
                            v-model="
                              infoModel.inbound_packages_list[scope.$index].inbound_packages_items_list[i].product_id
                            "
                            clearable
                            :key="idx"
                            @change="
                              changProduct_id(
                                `inbound_packages_list.${scope.$index}.inbound_packages_items_list.${i}.product_id`,
                              )
                            "
                            style="min-width:150px;max-width:250px;"
                            placeholder="请选择"
                          >
                            <el-option
                              v-for="ele in regionList"
                              :key="ele.id"
                              :disabled="skuHandlerDisabled(ele.id, scope.$index)"
                              :label="idx == 0 ? ele.sku : ele.name"
                              :value="ele.id"
                            >
                            </el-option>
                          </el-select>
                        </el-form-item>
                        <el-button
                          type="success"
                          v-if="idx == 0"
                          :disabled="isDisabledAdd(scope.$index)"
                          @click="addSkuNumber(scope)"
                          >添加产品</el-button
                        >
                      </template>

                      <template v-else-if="idx == 2">
                        <el-form-item
                          :prop="`inbound_packages_list.${scope.$index}.inbound_packages_items_list.${i}.per_quantity`"
                          :rules="checkRuleInfo.per_quantity"
                          label-width="0"
                          class="mb0 per_quantityClass"
                        >
                          <el-input-number
                            v-model="
                              infoModel.inbound_packages_list[scope.$index].inbound_packages_items_list[i].per_quantity
                            "
                            :min="0"
                            :controls="false"
                            :max="999999"
                            @blur="
                              blurQuantity(
                                2,
                                `inbound_packages_list.${scope.$index}.inbound_packages_items_list.${i}.per_quantity`,
                              )
                            "
                            style="min-width:150px;max-width:200px;"
                            label="请输入"
                          ></el-input-number>
                        </el-form-item>
                      </template>

                      <template v-else>
                        <el-form-item label-width="0" class="mb0">
                          <div class="flex_row_space-between" :key="idx">
                            <div>
                              {{
                                infoModel.inbound_packages_list[scope.$index].inbound_packages_items_list[i].quantity ||
                                  0
                              }}
                            </div>
                            <div v-if="i > 0" style="padding-right: 30px;">
                              <i
                                class="el-icon-delete"
                                style="color:red;cursor: pointer;"
                                @click="clearSkuList(scope.$index)"
                              ></i>
                            </div>
                          </div>
                        </el-form-item>
                      </template>
                    </div>

                    <div style="height:40px;"></div>
                  </template>
                </el-table-column>

                <el-table-column
                  prop="tracking_number"
                  header-align="center"
                  align="center"
                  width="200"
                  label="入库物流单号"
                >
                  <template slot-scope="scope">
                    <div class="boxposition">
                      <el-input
                        type="textarea"
                        autosize
                        maxlength="100"
                        show-word-limit
                        placeholder="请输入内容"
                        v-model="scope.row.tracking_number"
                      ></el-input>
                    </div>
                  </template>
                </el-table-column>

                <el-table-column
                  prop="Single_box_size"
                  header-align="center"
                  align="center"
                  width="400"
                  label="单箱尺寸"
                >
                  <template #header="scope">
                    <span><span style="color:red;"> * </span>{{ scope.column.label }}</span>
                  </template>
                  <template slot-scope="scope">
                    <div class="boxposition">
                      <el-form-item
                        :prop="`inbound_packages_list.${scope.$index}.quantitysize`"
                        :rules="checkRuleInfo.quantitysize"
                        label-width="0"
                        class="mb0 quantitysizeClass"
                      >
                        <el-input-number
                          v-model="scope.row.length"
                          :max="999999"
                          :min="0"
                          :controls="false"
                          class="inlineBlock"
                          placeholder="length"
                          @blur="$refs.ruleForm.validateField(`inbound_packages_list.${scope.$index}.quantitysize`)"
                          style="width:70px;"
                        ></el-input-number>

                        <el-input-number
                          v-model="scope.row.width"
                          :min="0"
                          :max="999999"
                          :controls="false"
                          placeholder="width"
                          class="inlineBlock"
                          @blur="$refs.ruleForm.validateField(`inbound_packages_list.${scope.$index}.quantitysize`)"
                          style="width:70px;"
                        ></el-input-number>

                        <el-input-number
                          v-model="scope.row.height"
                          :max="999999"
                          :min="0"
                          :controls="false"
                          class="inlineBlock"
                          @blur="$refs.ruleForm.validateField(`inbound_packages_list.${scope.$index}.quantitysize`)"
                          placeholder="height"
                          style="width:70px;"
                        ></el-input-number>

                        <el-select
                          v-model="scope.row.distance_unit"
                          style="width:70px;"
                          class="inlineBlock"
                          @change="$refs.ruleForm.validateField(`inbound_packages_list.${scope.$index}.quantitysize`)"
                          placeholder="unit"
                        >
                          <el-option label="in" :value="2"></el-option>
                          <el-option label="cm" :value="1"></el-option>
                        </el-select>
                      </el-form-item>
                    </div>
                  </template>
                </el-table-column>

                <el-table-column
                  :prop="`inbound_packages_list.${scope.$index}.weight`"
                  :rules="checkRuleInfo.weight"
                  header-align="center"
                  align="center"
                  width="200"
                  label="单箱重量"
                >
                  <template #header="scope">
                    <span><span style="color:red;"> * </span>{{ scope.column.label }}</span>
                  </template>
                  <template slot-scope="scope">
                    <div class="boxposition">
                      <el-form-item
                        :prop="`inbound_packages_list.${scope.$index}.weightsize`"
                        :rules="checkRuleInfo.weightsize"
                        label-width="0"
                        class="weightsizeClass"
                      >
                        <el-input-number
                          v-model="scope.row.weight"
                          :max="999999"
                          :controls="false"
                          @blur="$refs.ruleForm.validateField(`inbound_packages_list.${scope.$index}.weightsize`)"
                          class="inlineBlock"
                          placeholder="weight"
                          style="width:70px;"
                        ></el-input-number>

                        <el-select
                          v-model="scope.row.mass_unit"
                          style="width:90px;"
                          @change="$refs.ruleForm.validateField(`inbound_packages_list.${scope.$index}.weightsize`)"
                          class="inlineBlock"
                          placeholder="unit"
                        >
                          <el-option label="lb/oz" :value="2"></el-option>
                          <el-option label="kg" :value="1"></el-option>
                        </el-select>
                      </el-form-item>
                    </div>
                  </template>
                </el-table-column>

                <el-table-column prop="other_remark" header-align="center" align="center" width="200" label="备注">
                  <template slot-scope="scope">
                    <div class="boxposition">
                      <el-input
                        type="textarea"
                        autosize
                        maxlength="100"
                        show-word-limit
                        placeholder="请输入内容"
                        v-model="scope.row.other_remark"
                      ></el-input>
                    </div>
                  </template>
                </el-table-column>

                <el-table-column label="操作" width="180" align="center" fixed="right">
                  <template #default="scope">
                    <el-button
                      type="danger"
                      icon="el-icon-delete"
                      v-if="infoModel.inbound_packages_list.length > 1"
                      @click="changeDelete('delete', scope.row)"
                      >删除整行</el-button
                    >
                    <!-- :disabled="infoModel.inbound_packages_list.length <= 1" -->
                  </template>
                </el-table-column>
              </el-table>
            </el-col>
          </el-row>
        </el-card>
      </el-form>

      <div class="foot mtop10 flexCenter">
        <el-button @click="resetForm">取消</el-button>
        <el-button type="primary" class="mleft50" :loading="loading" @click="submitForm">提交</el-button>
      </div>
    </div>
  </div>
</template>

<script>
import { vaildatorRules } from './rule'
import API from '@/api/warehousing.js'
import { getInitTime } from '@/libs/common.js'

export default {
  name: 'addModal',

  props: {
    infoModel: {
      type: Object,
      default: () => ({}),
    },
    showModel: {
      type: Boolean,
      default: () => false,
    },

    warehouseList: {
      type: Array,
      default: () => [],
    },
  },

  watch: {
    showModel: {
      handler(val) {
        if (val) {
          if (!this.regionList.length) {
            this.getProductTypeHandler()
          }
        }
      },
      deep: true,
      immediate: true,
    },
  },

  data() {
    return {
      rules: vaildatorRules(this),
      columnsList: [
        {
          title: 'SKU',
          key: 'product_id',
          minWidth: 150,
        },
        {
          title: '产品名称',
          key: 'product_id',
          minWidth: 180,
        },

        {
          title: '数量/箱',
          key: 'per_quantity',
          minWidth: 120,
        },
        {
          title: '总数量',
          key: 'quantity',
          minWidth: 130,
        },
      ],

      regionList: [],
      loading: false,
    }
  },

  computed: {
    isDisabledAdd() {
      return i => {
        const list = this.infoModel.inbound_packages_list
        if (list && list.length) {
          const flag = list[i].inbound_packages_items_list.length >= this.regionList.length
          return flag
        }
        return true
      }
    },

    skuHandlerDisabled() {
      return (id, i) => {
        const list = this.infoModel.inbound_packages_list[i].inbound_packages_items_list
        const flag = list.filter(e => e.product_id == id)
        return !!flag.length
      }
    },

    /**
     * 验证原因
     */
    checkRuleInfo() {
      return {
        product_id: [
          {
            required: true,
            trigger: 'change',
            key: 'product_id',
            msgName: '请选择',
            validator: vaildatorRules(this).validetaDedRule,
          },
        ],
        per_quantity: [
          {
            required: true,
            trigger: 'blur',
            key: 'per_quantity',
            msgName: '请输入数量',
            validator: vaildatorRules(this).validetaDedRule,
          },
        ],
        quantitysize: [
          {
            required: true,
            trigger: 'change',
            key: 'quantitysize',
            msgName: '请输入尺寸',
            validator: vaildatorRules(this).validetaRuleHandler_03,
          },
        ],
        weightsize: [
          {
            required: true,
            trigger: 'change',
            key: 'mass_unit',
            msgName: '请输入重量',
            validator: vaildatorRules(this).validetaRuleHandler_04,
          },
        ],
        quantity: [
          {
            required: true,
            trigger: 'change',
            key: 'quantity',
            msgName: '请输入箱子数量',
            validator: vaildatorRules(this).validetaRuleHandler_05,
          },
        ],
        box_model: [
          {
            required: true,
            trigger: 'change',
            key: 'box_model',
            msgName: '请输入箱号',
            validator: vaildatorRules(this).validetaRuleHandler_06,
          },
        ],
      }
    },
  },

  methods: {
    changProduct_id(name) {
      this.$refs.ruleForm.validateField(name)
    },

    blurQuantity(type, name = '') {
      if (type == 2) {
        this.$refs.ruleForm.validateField(name)
      } else {
        this.$refs.ruleForm.validateField('quantity')
      }

      const list = this.infoModel.inbound_packages_list

      list.forEach(item => {
        if (item.quantity && item.inbound_packages_items_list) {
          item.inbound_packages_items_list.forEach(ele => {
            if (ele.per_quantity) {
              ele.quantity = item.quantity * ele.per_quantity
            }
          })
        }
      })

      // this.infoModel.inbound_packages_list[topindex].inbound_packages_items_list[i].quantity = num
    },
    scope(e) {
      console.log(e, 'e======')
    },
    tableRowClassName({ row, rowIndex }) {
      console.log(row, rowIndex)
      if (rowIndex === 1) {
        return 'warning-row'
      }
      if (rowIndex === 3) {
        return 'success-row'
      }
      return ''
    },
    changeDelete(row) {
      this.infoModel.inbound_packages_list.splice(row.$index, 1)
    },

    clearSkuList($index, i) {
      this.infoModel.inbound_packages_list[$index].inbound_packages_items_list.splice(i, 1)
    },

    addSkuNumber(data) {
      const i = data.$index
      // if (this.regionList.length > this.infoModel.inbound_packages_list[i].inbound_packages_items_list.length) {
      this.infoModel.inbound_packages_list[i].inbound_packages_items_list.push({
        product_id: '',
        quantity: '',
        per_quantity: '',
      })
      // }
    },

    addCase() {
      this.infoModel.inbound_packages_list.push({
        length: null,
        width: null,
        height: null,
        weight: null,
        inbound_packages_items_list: [{ product_id: '', quantity: '', per_quantity: '' }],
      })
    },

    // 查找重复数据
    filterLevelChange(list, type) {
      const flagid = [] // 这数组不能有相同的id
      list.forEach(item => {
        if (item[type]) {
          flagid.push(item[type])
        }
      })

      // 判断数据是否有重复数据
      const isRepeat = arr => {
        const tatget = []
        const hash = {}
        for (const i in arr) {
          if (hash[arr[i]]) {
            tatget.push(arr[i])
          }
          hash[arr[i]] = true
        }
        return tatget
      }
      return isRepeat(flagid)
    },

    removeItem(i, type) {
      if (type == 'shop_code') {
        this.infoModel.shops.splice(i, 1)
      } else {
        this.infoModel.product_barcodes.splice(i, 1)
      }
    },

    addHandler(type) {
      if (type === 'shop_code') {
        this.infoModel.shops.push({ shop_sku: '', shop_code: '' })
      } else {
        this.infoModel.product_barcodes.push({ custom_code_name: '', custom_code: '' })
      }
    },

    /**
     * 产品
     */
    async getProductTypeHandler() {
      try {
        const RES = await API.getProductHanlder()
        console.log(RES, '产品品类')
        this.regionList = RES.data || []
      } catch (error) {
        console.log(error)
      }
    },
    submitForm() {
      this.$refs.ruleForm.validate(async valid => {
        if (valid) {
          try {
            this.loading = true

            let res = null
            const params = { ...this.infoModel }

            if (params.estimate_delivery_time) {
              params.estimate_delivery_time = getInitTime(params.estimate_delivery_time, 'YYYY-MM-DD')
            }

            if (params.isAdd == 'add') {
              res = await API.add_Warehousing(params)
            } else {
              res = await API.edit_Warehousing(params)
            }

            this.loading = false

            if ((params.isAdd == 'add' && res.code == 1) || (params.isAdd == 'edit' && res.code == 2)) {
              this.$message({
                message: '提交成功',
                type: 'scuccess',
              })
              this.resetForm()
            } else {
              this.$message({
                message: `提交失败：${res.message}`,
                type: 'warning',
              })
            }
          } catch (error) {
            console.error(error)
            this.loading = false
            this.$message({
              message: `网络异常/提交失败：${error}`,
              type: 'warning',
            })
          }
        }
      })
    },
    resetForm() {
      this.$refs.ruleForm.resetFields()
      this.returnHandler()
    },
    returnHandler() {
      this.$emit('close', 'close')
    },
  },
}
</script>

<style lang="scss" scoped>
.addBox {
  width: 100%;
  height: 100%;
  background-color: #f2f4f6;
}

.foot {
  width: 100%;
  border-radius: 8px;
  height: 70px;
  border: 1px solid #d4cfcf;
  background-color: #e9eef3;
}

.el-table .warning-row {
  background: oldlace;
}

.el-table .success-row {
  background: #f0f9eb;
}

.boxposition {
  position: absolute;
  top: 10px;
  left: 0%;
  right: 0;
}

.quantitysizeClass /deep/ .el-form-item__error {
  margin-left: 58px !important;
}

.weightsizeClass /deep/ .el-form-item__error {
  margin-left: 20px !important;
}

.per_quantityClass /deep/ .el-form-item__error {
  margin-left: 16px !important;
}
</style>
